import { createMemo, splitProps, type ParentComponent } from "solid-js";
import type { FcLabelProps } from "./types";
import { wrapClasses } from "@lib/types";

const FcLabel: ParentComponent<FcLabelProps> = (props) => {
  const [local, elProps] = splitProps(props, [
    "ref",
    "$ServerOnly",
    "classList",
    "children",
  ]);

  const classList = createMemo(() => wrapClasses(local.classList));

  return (
    <label
      class="form-label"
      ref={local.ref}
      {...elProps}
      classList={classList()}
    >
      {local.children}
    </label>
  );
};

export default FcLabel;
